<!--content-->
<template>
  <div class="main_cont" ref="content">
    <div class="group">
      <el-button type="primary" size="small">保存</el-button>
      <el-button type="danger" size="small">删除协议</el-button>
    </div>
    <template v-if="width && height">
      <Tinymce :width="width" :height="height - 56" v-model="value" />
    </template>
  </div>
</template>
<script>
import Tinymce from '@/components/tinymce/index';
export default {
  components: {
    Tinymce
  },
  inject: ['reload'],
  data () {
    return {
      height: null,
      width: null,
      value: ''
    }
  },
  watch: {

  },
  methods: {
  },
  mounted () {
    this.$nextTick(() => {
      this.height = document.body.clientHeight - 84;
      this.width = this.$refs.content.clientWidth;
      window.onresize = () => {
        this.reload()
      }
    })
  }
}
</script>
<style lang="scss" scoped>
.main_cont {
  margin-left: 192px;
  height: 100%;
  .group {
    padding: 12px 5px;
    height: 56px;
  }
}
</style>